<template>
  <div>
    <h2>物流相关信息</h2>
    <div class="logistics-info-header">
      <div class="logistics-info-header-left">
        <div class="logistics-status">
          {{ status }}
        </div>
        <div class="logistics-company">{{ logisticsCompany }}</div>
        <div class="logistics-no">{{ logisticsNo }}</div>
      </div>
    </div>
    <ul class="logistics-info-list">
      <li v-for="(item, index) in logisticsInfo" :key="index">
        <div class="logistics-info-list-time">{{ item.time }}</div>
        <div class="logistics-info-list-content">{{ item.content }}</div>
      </li>
    </ul>
    <button v-change="role" disabled>查看物流详情</button>
  </div>
</template>

<script>
export default {
  name: 'LogiStics',
  props: ['logisticsInfo', 'logisticsCompany', 'logisticsNo', 'status', 'role']
}
</script>

<style></style>
